<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>按钮组</title>
    <link rel="stylesheet" href="css/division.css">
    <link rel="stylesheet" href="../dist/css/workflow-theme.css"> </head>
<body>
    <section>
        <div class="page-header">
            <p>正常按钮
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn" href="#">基本</a>
            <a class="btn disabled" href="#" disabled>禁用</a>
            <button class="btn" type="button">基本</button>
            <button class="btn" type="button" disabled>禁用</button>
            <input class="btn" type="submit" value="基本">
            <input class="btn" type="submit" value="基本" disabled>
            <div class="btn">基本</div>
            <div class="btn disabled">基本</div>
            <span class="btn">基本</span>
            <span class="btn disabled">基本</span>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut" href="#">默认</a>
            <a class="btn btn-defalut" href="#" disabled>禁用</a>
            <button class="btn btn-defalut" type="button">默认</button>
            <button class="btn btn-defalut" type="button" disabled>禁用</button>
            <input class="btn btn-defalut" type="submit" value="默认">
            <input class="btn btn-defalut" type="submit" value="禁用" disabled>
            <div class="btn btn-defalut">默认</div>
            <div class="btn btn-defalut disabled">禁用</div>
            <span class="btn btn-defalut">默认</span>
            <span class="btn btn-defalut disabled">禁用</span>
        </div>
        <div class="form-group">
            <a class="btn btn-primary" href="#">主要</a>
            <a class="btn btn-primary" href="#" disabled>禁用</a>
            <button class="btn btn-primary" type="button">主要</button>
            <button class="btn btn-primary" type="button" disabled>禁用</button>
            <input class="btn btn-primary" type="submit" value="主要">
            <input class="btn btn-primary" type="submit" value="禁用" disabled>
            <div class="btn btn-primary">主要</div>
            <div class="btn btn-primary disabled">禁用</div>
            <span class="btn btn-primary">主要</span>
            <span class="btn btn-primary disabled">禁用</span>
        </div>
        <div class="form-group">
            <a class="btn btn-info" href="#">信息</a>
            <a class="btn btn-info" href="#" disabled>禁用</a>
            <button class="btn btn-info" type="button">信息</button>
            <button class="btn btn-info" type="button" disabled>禁用</button>
            <input class="btn btn-info" type="submit" value="信息">
            <input class="btn btn-info" type="submit" value="禁用" disabled>
            <div class="btn btn-info">信息</div>
            <div class="btn btn-info disabled">禁用</div>
            <span class="btn btn-info">信息</span>
            <span class="btn btn-info disabled">禁用</span>
        </div>
        <div class="form-group">
            <a class="btn btn-warning" href="#">警告</a>
            <a class="btn btn-warning" href="#" disabled>禁用</a>
            <button class="btn btn-warning" type="button">警告</button>
            <button class="btn btn-warning" type="button" disabled>禁用</button>
            <input class="btn btn-warning" type="submit" value="警告">
            <input class="btn btn-warning" type="submit" value="禁用" disabled>
            <div class="btn btn-warning">警告</div>
            <div class="btn btn-warning disabled">禁用</div>
            <span class="btn btn-warning">警告</span>
            <span class="btn btn-warning disabled">禁用</span>
        </div>
        <div class="form-group">
            <a class="btn btn-danger" href="#">错误</a>
            <a class="btn btn-danger" href="#" disabled>禁用</a>
            <button class="btn btn-danger" type="button">错误</button>
            <button class="btn btn-danger" type="button" disabled>禁用</button>
            <input class="btn btn-danger" type="submit" value="错误">
            <input class="btn btn-danger" type="submit" value="禁用" disabled>
            <div class="btn btn-danger">错误</div>
            <div class="btn btn-danger disabled">禁用</div>
            <span class="btn btn-danger">错误</span>
            <span class="btn btn-danger disabled">禁用</span>
        </div>
    </section>
    <section>
        <div class="page-header">
            <p>中号按钮
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn medium" href="#">基本</a>
            <a class="btn medium" href="#" disabled>禁用</a>
            <button class="btn medium">基本</button>
            <button class="btn medium" disabled>禁用</button>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut medium" href="#">默认</a>
            <a class="btn btn-defalut medium" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-primary medium" href="#">主要</a>
            <a class="btn btn-primary medium" href="#" disabled>禁用</a>
            <button class="btn btn-primary medium">主要</button>
            <button class="btn btn-primary medium" disabled>禁用</button>
        </div>
        <div class="form-group">
            <a class="btn btn-info medium" href="#">信息</a>
            <a class="btn btn-info medium" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-warning medium" href="#">警告</a>
            <a class="btn btn-warning medium" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-danger medium" href="#">错误</a>
            <a class="btn btn-danger medium" href="#" disabled>禁用</a>
        </div>
    </section>
    <section>
        <div class="page-header">
            <p>中号按钮 带图标
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn medium" href="#"><img src="images/placeholder.jpg" alt="ico">基本</a>
            <a class="btn medium" href="#" disabled><img alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut medium" href="#"><img src="images/placeholder.jpg" alt="ico">默认</a>
            <a class="btn btn-defalut medium" href="#" disabled><img alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-primary medium" href="#"><img src="images/placeholder.jpg" alt="ico">主要</a>
            <a class="btn btn-primary medium" href="#" disabled><img alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-info medium" href="#"><img src="images/placeholder.jpg" alt="ico">信息</a>
            <a class="btn btn-info medium" href="#" disabled><img alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-warning medium" href="#"><img src="images/placeholder.jpg" alt="ico">警告</a>
            <a class="btn btn-warning medium" href="#" disabled><img alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-danger medium" href="#"><img src="images/placeholder.jpg" alt="ico">错误</a>
            <a class="btn btn-danger medium" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
    </section>
    <section>
        <div class="page-header">
            <p>小号按钮
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn small" href="#">基本</a>
            <a class="btn small" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut small" href="#">默认</a>
            <a class="btn btn-defalut small" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-primary small" href="#">禁用</a>
            <a class="btn btn-primary small" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-info small" href="#">信息</a>
            <a class="btn btn-info small" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-warning small" href="#">警告</a>
            <a class="btn btn-warning small" href="#" disabled>禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-danger small" href="#">错误</a>
            <a class="btn btn-danger small" href="#" disabled>禁用</a>
        </div>
    </section>
    <section>
        <div class="page-header">
            <p>小号按钮 带图标
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn small" href="#"><img src="images/placeholder.jpg" alt="ico">基本</a>
            <a class="btn small" href="#" disabled><img src="images/placeholder.jpg" src="" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut small" href="#"><img src="images/placeholder.jpg" alt="ico">默认</a>
            <a class="btn btn-defalut small" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-primary small" href="#"><img src="images/placeholder.jpg" alt="ico">主要</a>
            <a class="btn btn-primary small" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-info small" href="#"><img src="images/placeholder.jpg" alt="ico">信息</a>
            <a class="btn btn-info small" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-warning small" href="#"><img src="images/placeholder.jpg" alt="ico">警告</a>
            <a class="btn btn-warning small" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-danger small" href="#"><img src="images/placeholder.jpg" alt="ico">错误</a>
            <a class="btn btn-danger small" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
    </section>
    <section>
        <div class="page-header">
            <p>带图标
                <small>a、input、button、div、span</small>
            </p>
        </div>
        <div class="form-group">
            <a class="btn" href="#"><img src="images/placeholder.jpg" alt="ico">基本</a>
            <a class="btn" href="#" disabled><img src="images/placeholder.jpg"  alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-defalut" href="#"><img src="images/placeholder.jpg" alt="ico">默认</a>
            <a class="btn btn-defalut" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-primary" href="#"><img src="images/placeholder.jpg" alt="ico">主要</a>
            <a class="btn btn-primary" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-info" href="#"><img src="images/placeholder.jpg" alt="ico">信息</a>
            <a class="btn btn-info" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-warning" href="#"><img src="images/placeholder.jpg" alt="ico">警告</a>
            <a class="btn btn-warning" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
        <div class="form-group">
            <a class="btn btn-danger" href="#"><img src="images/placeholder.jpg" alt="ico">错误</a>
            <a class="btn btn-danger" href="#" disabled><img src="images/placeholder.jpg" alt="ico">禁用</a>
        </div>
    </section>
</body>
</html>